<template>
  <div>
    <HeaderComponent />
    <main>
      <TabNav />
      <div class="dw">
        <div class="wrap">
          <router-view> </router-view>
        </div>
      </div>
    </main>
  </div>
</template>

<script>
import HeaderComponent from '@/components/public/HeaderComponent';
import TabNav from '@/components/public/TabNav';
export default {
  name: 'HomeRouter',

  data() {
    return {};
  },
  components: {
    HeaderComponent,
    TabNav
  },

  mounted() {},

  methods: {}
};
</script>

<style lang="less" scoped>
header {
  height: 50px;
  background: #001529;
}

main {
  display: flex;
  background-color: #f0f2f5;

  .dw {
    width: calc(100vw - 216px);
    height: calc(100vh - 50px);
    position: relative;
    overflow: auto;

  }

  .wrap {
    width: 1136px;
    margin: 30px auto;
    // box-sizing: border-box;
    // border: 1px solid #000;
    background-color: #f0f2f5;
    position: absolute;
    left: 0;
    right: 0;
  }
}
</style>